import React, { Component } from "react";
interface IState {
  count: number;
  width: number;
}
export default class StateDemo extends Component<any, IState> {
  constructor(props: any, context: any) {
    super(props, context);
    // 只能在这里调用一次赋值
    this.state = {
      count: 0,
      width: 200,
    };
  }
  componentDidMount() {
    //   执行自增的count数
    // setInterval(() => {
    //   this.setState((state) => ({
    //     count: state.count + 1,
    //   }));
    // }, 1000);
  }
  changewid = () => {
    this.setState((state, props) => ({
      width: state.width + 10,
    }));
  };
  render() {
    return (
      <div>
        <p>{this.state.count}</p>
        <p style={{ width: this.state.width + "px", backgroundColor: "red" }}>
          1
        </p>
        <button onClick={this.changewid}>改变</button>
      </div>
    );
  }
}
